﻿
@using IOA.MES.DataAccess.VModel
@{
    ViewBag.Title = "返工单编辑";
    Layout = "~/Views/Shared/_LayoutPage.cshtml";
    var workshops = (List<VWorkshop>)ViewBag.WorkShops;
    var reworkTypes = (List<KeyValuePair<int, string>>)ViewBag.ReworkTypes;
    var sites = (List<KeyValuePair<int, string>>)ViewBag.Sites;
}
@model IOA.MES.DataAccess.VModel.VReworkOrder

@section Contents{
    <style>
        html {
            background-color: #FFF;
        }

        .layui-form-item .layui-input-inline {
            width: 300px;
        }

        .red {
            color: red;
        }

        .layui-form-item .layui-form-checkbox[lay-skin=primary] {
            margin-top: 0;
        }

        .layui-form-item .layui-form-checkbox {
            margin-top: 0;
        }
    </style>
}

<div id="page"></div>

<script type="text/ng-template" id="tplPage">
    <div class="layui-form" lay-filter="layuiadmin-app-form-list" style="padding: 20px 30px;">
        <div class="layui-form-item">
            <label class="layui-form-label" v-html="lang.Field.ReworkType">返工类型：</label>
            <div class="layui-input-inline">
                <select name="ReworkType" @(Model != null && Model.Items.Any() ? " disabled" : "")>
                    @foreach (var item in reworkTypes)
                    {
                        <option value="@item.Key" @(Model != null && (int)Model.ReworkType == item.Key ? " selected" : "")>@item.Value</option>
                    }
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label" v-html="lang.Field.ReworkWorkshop">返工车间</label>
            <div class="layui-input-inline">
                <select name="WorkshopCode">
                    @foreach (var item in workshops)
                    {
                        <option value="@item.WorkshopCode" @(Model != null && string.Equals(Model.WorkshopCode, item.WorkshopCode, StringComparison.CurrentCultureIgnoreCase) ? " selected" : "")>@item.WorkshopName</option>
                    }
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label" v-html="lang.Field.ReworkInstructions">返工说明：</label>
            <div class="layui-input-inline">
                <textarea class="layui-textarea" name="Remark" value="@(Model?.Remark)" placeholder="请输入返工说明"></textarea>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label" v-html="lang.Field.ReworkProcess">返工工序：</label>
            <div class="layui-input-inline">
                <select id="selSites" lay-filter="selSites" name="Site">
                    @foreach (var item in sites)
                    {
                        <option value="@item.Key">@item.Value</option>
                    }
                </select>
            </div>
        </div>
        <div class="layui-form-item" style="margin:0;" v-for="(item, index) in model.Sites">
            <label class="layui-form-label"></label>
            <div class="layui-input-inline">
                <span>{{item.SiteName}}过站：</span>
                <span>{{item.UseMaterials?"扣料":"不扣料"}}</span>
                <i class="layui-icon layui-icon-delete" style="color:red;" @@click="removeItem(item)"></i>
            </div>
        </div>
        <div class="layui-form-item" style="text-align:center;padding-top: 20px;">
            <input type="hidden" value="@(Model?.ReworkNo)" name="ReworkNo" />
            <button class="layui-btn layui-btn-primary" onclick="parent.layer.close(parent.layer.getFrameIndex(window.name));"><i class="layui-icon">&#xe616;</i>{{lang.Field.Cancel}}</button>
            <button class="layui-btn layui-btn-normal" lay-submit lay-filter="submit"><i class="layui-icon">&#xe605;</i>{{lang.Field.Submit}}</button>
        </div>
    </div>
</script>

@section Scripts{
    <script>
        var vm = new Vue({
            el: "#page",
            template: "#tplPage",
            data: {
                lang: JSON.parse(lang).package,
                sites: @Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(sites)),
                model: @Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(Model!=null?Model:new VReworkOrder()))
            }
        });

        setTimeout(function () {
            initLayui();
        }, 50);

        function initLayui() {
            layui.use(['form', 'layer', 'index', 'laydate'], function () {
                var layer = layui.layer,
                    form = layui.form;

                form.on('select(selSites)', function (data) {
                    layer.open({
                        type: 2,
                        shade: [0.1, '#000'],
                        area: ['400px', '300px'],
                        content: "/Quality/SelectSite?site=" + data.value
                    });
                });

                form.on('submit(submit)', function (data) {
                    var forms = data.field;
                    forms.Sites = vm.$data.model.Sites;
                    console.log(forms);
                    var loadId = layer.load();
                    $.ajax({
                        url: "/Quality/SaveRework",
                        data: forms,
                        complete: function () {
                            layer.close(loadId);
                        },
                        success: function (res) {
                            if (res.ErrCode != 200) {
                                layer.msg(res.ErrMsg, { icon: 5 });
                                return;
                            }
                            layer.msg("保存成功！", { icon: 6, time: 1500 }, function () {
                                parent.layer.close(parent.layer.getFrameIndex(window.name));
                            });
                        }
                    });
                    return false;
                });
            });
        }

        function removeItem(item) {
            for (var i = 0; i < vm.$data.model.Sites.length; i++) {
                if (vm.$data.model.Sites[i].SiteType == item.SiteType) {
                    vm.$data.model.Sites.splice(i, 1);
                    break;
                }
            }
            setTimeout(function () {
                layui.form.render("checkbox");
            }, 50);
        }

        function addSite(siteType, siteName, userMaterial) {
            console.log(siteName);
            var exist = vm.$data.model.Sites.find(function (e) {
                return e.SiteType == siteType;
            });
            if (!exist) {
                vm.$data.model.Sites.push({
                    SiteType: siteType,
                    SiteName: siteName,
                    UseMaterials: userMaterial
                });
                setTimeout(function () {
                    form.render("checkbox");
                }, 50);
            }
        }
    </script>
}
